<h4>hover mode</h4>
<d-cascader
  [options]="options"
  [placeholder]="'please select'"
  [(ngModel)]="value1"
  (ngModelChange)="onChanges($event)"
  [dropdownPanelClass]="'custom-class'"
>
  <ng-template #dropdownHeaderTemplate>
    <d-tabs [type]="'tabs'" [(activeTab)]="tab1acticeID">
      <d-tab id="tab1" title="Tab1" tabId="tab1"> </d-tab>

      <d-tab id="tab2" title="Tab2" tabId="tab2"> </d-tab>

      <d-tab id="tab3" title="Tab3" tabId="tab3"> </d-tab>
    </d-tabs>
  </ng-template>
</d-cascader>

<h4>click mode</h4>
<d-cascader
  [options]="options"
  [placeholder]="'please select'"
  [(ngModel)]="value2"
  [trigger]="'click'"
  (ngModelChange)="onChanges($event)"
  [showPath]="true"
  [allowClear]="true"
  [dropdownWidth]="120"
></d-cascader>

<h4>data empty</h4>
<d-cascader
  [options]="[]"
  [placeholder]="'please select'"
  [(ngModel)]="value3"
  [trigger]="'click'"
  (ngModelChange)="onChanges($event)"
></d-cascader>

<h4>disabled</h4>
<d-cascader [options]="[]" [placeholder]="'please select'" [(ngModel)]="value4" [trigger]="'click'" [disabled]="true"></d-cascader>
